<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title th:text="${assignment.title + ' - 作业详情'}">作业详情 - 学习资源平台</title>
    <link rel="stylesheet" th:href="@{/css/common.css}">
    <link rel="stylesheet" th:href="@{/css/navbar.css}">
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
    <link rel="stylesheet" th:href="@{/css/assignmentdetail.css}">
</head>
<body>
<div class="container">
    <!-- 导航栏 -->
    <nav class="navbar navbar-expand-lg">
        <div class="container">
            <a class="navbar-brand" href="#">云学堂</a>
            <div class="collapse navbar-collapse">
                <ul class="navbar-nav mr-auto">
                    <li class="nav-item">
                        <a class="nav-link" th:href="@{/resource/list}">学习资源</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link active" th:href="@{/assignment/list}">作业与考试</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" th:href="@{/forum/list}">交流互动</a>
                    </li>
                    <li class="nav-item" th:if="${session.identity=='superAdmin' || session.identity=='ordinaryAdmin'}">
                        <a class="nav-link" th:href="@{/admin/index}">管理中心</a>
                    </li>
                </ul>
                <ul class="navbar-nav">
                    <li class="nav-item">
                        <a class="nav-link" th:href="@{/user/digital}">个人中心</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" th:href="@{/user/logout}">退出</a>
                    </li>
                </ul>
            </div>
        </div>
    </nav>

    <!-- 主内容 -->
    <div class="row mt-4">
        <div class="col-12">
            <nav aria-label="breadcrumb">
                <ol class="breadcrumb">
                    <li class="breadcrumb-item"><a th:href="@{/assignment/list}">作业列表</a></li>
                    <li class="breadcrumb-item active" th:text="${assignment.title}">作业标题</li>
                </ol>
            </nav>
            
            <div class="card">
                <div class="card-header">
                    <h3 th:text="${assignment.title}" class="assignment-title">作业标题</h3>
                </div>
                <div class="card-body">
                    <div class="row">
                        <div class="col-md-9">
                            <p><strong>作业描述:</strong></p>
                            <p th:text="${assignment.description ?: '暂无描述'}">作业描述内容</p>
                            <p><strong>所属专业:</strong>
                                <span th:if="${major != null}" th:text="${major.majorName}">专业名称</span>
                            </p>
                            <p><strong>截止时间:</strong> 
                                <span th:text="${#temporals.format(assignment.deadline, 'yyyy-MM-dd HH:mm')}">截止时间</span>
                            </p>
                            <p><strong>状态:</strong> 
                                <span th:if="${assignment.status == 1}" class="status-badge status-active">进行中</span>
                                <span th:if="${assignment.status == 0}" class="status-badge status-inactive">已结束</span>
                            </p>
                            <div th:if="${assignment.fileUrl}" class="mt-3">
                                <p><strong>附件:</strong></p>
                                <a th:href="${assignment.fileUrl}" class="btn btn-outline-primary btn-sm" target="_blank">
                                    <i class="fas fa-download me-1"></i>下载附件
                                </a>
                            </div>
                            
                            <!-- 作业提交列表（仅管理员可见） -->
                            <div th:if="${session.identity=='superAdmin' || session.identity=='ordinaryAdmin'}" class="mt-4">
                                <h5><i class="fas fa-list me-2"></i>作业提交列表</h5>
                                <div class="table-responsive">
                                    <table class="table table-striped">
                                        <thead>
                                            <tr>
                                                <th>学生</th>
                                                <th>提交时间</th>
                                                <th>状态</th>
                                                <th>得分</th>
                                                <th>评语</th>
                                                <th>操作</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            <tr th:each="submission : ${submissions}">
                                                <td th:text="${userMap.get(submission.userId) ?: '未知用户'}">学生姓名</td>
                                                <td th:text="${#temporals.format(submission.submittedTime, 'yyyy-MM-dd HH:mm')}">提交时间</td>
                                                <td>
                                                    <span th:if="${submission.status == 0}" class="badge bg-warning">待批改</span>
                                                    <span th:if="${submission.status == 1}" class="badge bg-success">已批改</span>
                                                </td>
                                                <td th:text="${submission.score ?: '-'}">得分</td>
                                                <td th:text="${submission.comment ?: '-'}">评语</td>
                                                <td>
                                                    <button class="btn btn-sm btn-info" th:attr="onclick='gradeSubmission('+${submission.id}+', \''+${submission.score ?: ''}+'\', \''+${submission.comment ?: ''}+'\')'">
                                                        <i class="fas fa-edit"></i> 
                                                        <span th:if="${submission.status == 0}">批改</span>
                                                        <span th:if="${submission.status == 1}">修改</span>
                                                    </button>
                                                </td>
                                            </tr>
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                        
                        <div class="col-md-3">
                            <div class="card info-card">
                                <div class="card-body">
                                    <p><strong><i class="fas fa-info-circle me-2"></i>作业信息</strong></p>
                                    <p class="info-label">发布时间:</p>
                                    <p><span th:text="${#temporals.format(assignment.createdTime, 'yyyy-MM-dd HH:mm')}">发布时间</span></p>
                                    
                                    <div th:if="${submission == null}">
                                        <a th:href="@{'/assignment/submit/' + ${assignment.id}}" class="btn btn-primary btn-block">
                                            <i class="fas fa-upload me-1"></i>提交作业
                                        </a>
                                    </div>
                                    <div th:unless="${submission == null}">
                                        <p th:if="${submission.status == 1}" class="text-success"><i class="fas fa-check-circle me-1"></i>已提交</p>
                                        <p th:if="${submission.status == 0}" class="text-error"><i class="fas fa-times-circle me-1"></i>未提交</p>
                                        <p class="info-label">提交时间:</p>
                                        <p><span th:text="${#temporals.format(submission.submittedTime, 'yyyy-MM-dd HH:mm')}">提交时间</span></p>
                                        <a th:href="${submission.fileUrl}" class="btn btn-outline-success btn-sm" target="_blank">
                                            <i class="fas fa-eye me-1"></i>查看提交
                                        </a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    
    <!-- 批改作业模态框 -->
    <div class="modal fade" id="gradeSubmissionModal" tabindex="-1" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title"><i class="fas fa-edit me-2"></i>批改作业</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body">
                    <form id="gradeForm">
                        <input type="hidden" id="submissionId">
                        <div class="mb-3">
                            <label for="score" class="form-label">得分</label>
                            <input type="number" class="form-control" id="score" min="0" max="100" step="0.5" required>
                        </div>
                        <div class="mb-3">
                            <label for="comment" class="form-label">评语</label>
                            <textarea class="form-control" id="comment" rows="3"></textarea>
                        </div>
                    </form>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal"><i class="fas fa-times me-1"></i>取消</button>
                    <button type="button" class="btn btn-primary" id="saveGradeBtn"><i class="fas fa-save me-1"></i>保存</button>
                </div>
            </div>
        </div>
    </div>
</div>

<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.bundle.min.js"></script>
<script th:src="@{/js/jquery.min.js}"></script>
<script th:src="@{/js/assignmentdetail.js}"></script>
</body>
</html>